page-insured-client-detail {
    ion-header {
        .toolbar-background{
            background: linear-gradient(to right, #38b34d, #2c77bc);
            color:#333;
        }
        ion-toolbar{
            .toolbar-title{
                color:#FFFFFF;
                font-size: 4.8vw;
            }
            .icon-back {
                width: 8vw;
                height: 7vw;
                background: url("../assets/images/client/client-detail/icon_return.png") no-repeat;
                background-size: cover;
            }
            .icon-favorites {
                width: 4.5vw;
                height: 4.5vw;
                background: url("../assets/images/client/client-detail/icon_favorites_yes.png") no-repeat;
                background-size: cover;
            }
            .icon-favorites-no {
                width: 4.5vw;
                height: 4.5vw;
                background: url("../assets/images/client/client-detail/icon_favorites_no.png") no-repeat;
                background-size: cover;
            }
            .text-favorites {
                color: #fff;
                font-size: 4vw;
                margin-right: 2.8vw;
                margin-left: 2vw
            }
        }
        .base-info{
            background: linear-gradient(to right, #63b24c, #018c6e);
            box-shadow: 0 0 64px rgba(0, 0, 0, 0.3);
            .baseMessage{
                height: 25vw;
                padding: 4vw 5vw;
                overflow: hidden;
                .part{
                    float:left;
                    height:100%;
                }
                .part1{
                    width:12vw;
                    img{
                        width:11.02vw;
                        height:14.84vw;
                    }
                }
                .part2{
                    width:10vw;
                    padding: 1vw 2vw;
                    img{
                        width:6vw;
                        height:6vw;
                    }
                }
                .part3{
                    width:40vw;
                    p{
                        margin:0;
                        display: flex;
                        align-items: center;
                    }
                    .name{
                        font-size: 5.69vw;
                        color: #FFFFFF;
                        margin-bottom: 1vw;
                        width: auto;
                        display: inline;
                        padding: 0.5vw 1vw;
                        &.is-death{
                            border:1px solid #fff;
                        }
                        .vipType{
                            background-repeat: no-repeat;
                            background-size: cover;
                            width:6vw;
                            height:6vw;
                            &.gold {
                                background-image: url('../assets/images/client/client-list/icon_vip_gold.png');
                            }
                            &.platinum {
                                background-image: url('../assets/images/client/client-list/icon_vip_platinum.png');
                            }
                            &.diamond {
                                background-image: url('../assets/images/client/client-list/icon_vip_diamond.png');
                            }
                            &.supreme {
                                background-image: url('../assets/images/client/client-list/icon_vip_supreme.png');
                            }
                        }
                    }
                    .age{
                        font-size: 4.8vw;
                        padding-top:1vw;
                        color:#FFFFFF;
                        .sexCode{
                            width: 4.62vw;
                            height: 4.62vw;
                            margin-right: 1vw;
                        }
                    }
                }
                .part4{
                    width:30vw;
                    padding-top: 4.5vw;
                    text-align: right;
                    margin-left:5.5vw;
                    .note{
                        background: url("../assets/images/client/client-detail/icon_notes.png") no-repeat;
                        background-size: cover;
                        width: 5.87vw;
                        height: 5.87vw;
                        display: inline-block;
                        vertical-align: middle;
                    }
                    .phone{
                        background: url("../assets/images/client/client-detail/icon_call.png") no-repeat;
                        background-size: cover;
                        width: 5.87vw;
                        height: 5.87vw;
                        display: inline-block;
                        margin-left:4.4vw;
                        vertical-align: middle;
                        span{
                            width:100%;
                            height:100%;
                            position: relative;
                            ion-select{
                                width: 100%;
                                height: 100%;
                                margin: 0;
                                padding: 0;
                                opacity: 0;
                                button{
                                    width: 8vw;
                                    height: 8vw;
                                    left: 0;
                                    top: 0;
                                }
                            }
                        }
                    }

                    .go-map{
                        background:url('../assets/images/client/client-detail/icon_directions.png') no-repeat;
                        background-size: cover;
                        width: 5.87vw;
                        height: 5.87vw;
                        display: inline-block;
                        margin-left: 4.4vw;
                        vertical-align: middle;
                    }

                }
            }
        }
    }
    ion-content{
        .main-content{
            padding: 0 8.35vw 20vw 8.35vw;
            .con-grid{
                height: 25vw;
                padding-top: 8vw;
                .con-col{
                    float: left;
                    .col-title{
                        font-size: 4.44vw;
                        color: #1f212a;
                        padding-bottom: 2vw;
                    }
                    .col-content{
                        font-size: 4.27vw;
                        color: #39b54a;
                    }
                }
                .col1{
                    width: 15%;
                    text-align: center;
                }
                .col2{
                    width: 70%;
                    text-align: center;
                }
                .col3{
                    width: 15%;
                    text-align: center;
                }
            }
            .panel{
                padding-bottom:5vw;
            }
            .panel.panel-border{
               // border-bottom: 1px solid #e9e9e9;
            }
            //销售线索
            .saleLeads {
                height: 28.42vw;
                display: none;
                p {
                    font-size: 4.62vw;
                    color: #1f212a;
                }
                .signList {
                    position: relative;
                    span {
                        border-radius: 5vw;
                        color: #1f212a;
                        background: #e9e9e9;
                        margin-right: 1.85vw;
                        padding: 1vw 3vw;
                        font-size: 3.89vw;
                        margin-bottom: 2vw;
                        display: inline-block;
                        height: 6.67vw;
                    }
                    .leadsMore {
                        line-height: 2.67vw;
                        position: absolute;
                        display: inline-block;
                    }
                }
            }
            .toggle-panel{
                .toggle-head{
                    text-align: center;
                    line-height: 12vw;
                    button{
                        width: 16.98vw;
                        height: 10vw;
                        background-color: transparent;
                        color: #1f212a;
                        font-size: 2.84vw;
                        .up{
                            display: inline-flex;
                            vertical-align: middle;
                            width: 4.27vw;
                            height: 4.27vw;
                            background: url("../assets/images/client/client-detail/icon_up.png") no-repeat;
                            background-size: cover;
                        }
                        .down{
                            display: inline-flex;
                            vertical-align: middle;
                            width: 4.27vw;
                            height: 4.27vw;
                            background: url("../assets/images/client/client-detail/icon_more.png") no-repeat;
                            background-size: cover;
                        }
                    }
                }
            }
            .panel-title{
                font-size: 4.44vw;
                color: #1f212a;
                padding: 5.33vw 0 2vw 0;
                button{
                    background-color: transparent;
                    float: right;
                    color: #39b54a;
                    padding:0;
                    span {
                        font-size: 3.89vw;
                        position: relative;
                        padding-left: 7.11vw;
                        .icon-edit {
                            position: absolute;
                            top: -1vw;
                            left: 0;
                            display: inline-flex;
                            vertical-align: middle;
                            width: 6.11vw;
                            height: 6.11vw;
                            font-style: normal;
                            background: url("../assets/images/client/client-detail/icon_editor.png") no-repeat;
                            background-size: cover;
                        }
                    }
                }
            }
            .word-break{
                overflow: hidden;
            }
            .panel-item{
                border-bottom: 1px solid #f6f6f6;
                font-size: 3.73vw;
                line-height: 8vw;
                clear: both;
                overflow: hidden;
                span:first-child{
                    color: #939598;
                }
                span:last-child{
                    color: #58595b;
                    float: right;
                }
                span.address{
                    word-wrap: break-word;
                    display: block;
                    width: 84%;
                    text-align: right;
                }
                span.nameLength{
                    word-wrap: break-word;
                    display: block;
                    width: 84%;
                    text-align: right;
                }
                span.phoneNum{
                    width:84%;
                    text-align: right;
                }
            }
            .nameLengthBox{
                overflow: hidden;
            }
            .panel-item.no-border{
                border: 0;
            }
            .del-panel{
                padding: 5.3vw 0;
                text-align: center;
                .deleteBtn{
                    width: 16.98vw;
                    height: 5.69vw;
                    color: #FFFFFF;
                    background-color: #da5c56;
                    font-size: 2.67vw;
                    border-radius: 2.85vw;
                }
            }
        }
    }
}
